<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新增</title>
</head>
<script type="text/javascript" src="js/vue.global.prod.js"></script>
<script type="text/javascript" src="js/axios.min.js"></script>
<body style="width: 100%">
<div style="border: 1px solid coral;width: 400px;margin: auto;height: 300px" id="erer">
    <form method="get">
    <div style="width: 300px;border: darkgray solid 1px;margin: auto;margin-top: 30px;text-align: center">增加标准信息</div>
    <div style="width: 300px;border: darkgray solid 1px;margin: auto">
        <div style="display: flex">
            <div>标准号</div>
            <div><input v-model="name"/></div>
        </div>
        <div style="display: flex">
            <div>中文名称</div>
            <div><input v-model="zhname"/></div>
        </div>
        <div style="display: flex">
            <div>版本</div>
            <div><input v-model="version"/></div>
        </div>
        <div style="display: flex">
            <div>关键词</div>
            <div><input v-model="keys"/></div>
        </div>
        <div style="display: flex">
            <div>发布日期</div>
            <div><input v-model="ksdate"/></div>
        </div>
        <div style="display: flex">
            <div>实施日期</div>
            <div><input v-model="jsdate"/></div>
        </div>
        <div style="display: flex">
            <div>附件</div>
            <div><input type="file" ref="file"/></div>
        </div>
        <button @click="checked">保存</button>
        <button>取消</button>
    </div>
    </form>
</div>

</body>
<script>
    const App = {
        data() {
            return {
                name: '',
                zhname:'',
                version:'',
                keys:'',
                ksdate:'',
                jsdate:'',
                path:'',
                file: '',
            }
        },
        methods:{
           checked(e){
               e.preventDefault();
               axios.get("/api/checked?name="+this.name)
                   .then((response)=>{
                       if(response.data==1){
                           alert("标准号重复了")
                       }else{
                               let forms  = new FormData();
                               forms.append("file",this.$refs.file.files[0]);
                               forms.append("name", this.name)
                               forms.append("zhname", this.zhname)
                               forms.append("version", this.version)
                               forms.append("keys", this.keys)
                               forms.append("ksdate", this.ksdate)
                               forms.append("jsdate", this.jsdate)
                               var configs = { // 上传文件 请求头要设置成下面这样
                                   headers:{'Content-Type':'multipart/form-data'}
                               };
                               axios.post(`/api/checked`,forms,configs)
                                   .then((response) => {
                                       location.href="index.html";
                                   },err=>{
                                       alert("错误")
                                   })
                           }

                   })
            }

        }

    };
    Vue.createApp(App).mount('#erer');
</script>
</html>